import React, { PureComponent } from 'react'

import './switch.less'

class Switch extends PureComponent {
  static defaultProps = {
    theme: 'night',
    onChange: () => {}
  }

  state = {
    on: false
  }

  onClick = () => {
    const on = !this.state.on
    this.props.onChange(on)
    this.setState({ on })
  }

  render () {
    return (
      <div
        className={`switch-${this.props.theme} ${this.state.on && 'switch-on'}`}
        onClick={this.onClick}>
        <i className="switch-button"/>
      </div>
    )
  }
}

export default Switch
